
import React, { Component } from 'react';
import Side from './Side';
import axios from 'axios';

class Classify extends Component {
    constructor(props){
        super(props);
        this.state={
            classify:[],
            i:0
        }
    }
    componentDidMount(){
        axios.get("/api/classify").then((res)=>{
            this.setState({
                classify:res.data.classify
            })

        })
    }
    saveI=(index)=>{
        this.setState({
            i:index
        })
        console.log(1111);
    }
    
    render() {
        return (
            <div className="classify">
                <Side classify={this.state.classify} i={this.state.i} saveI={this.saveI}></Side>
                <div className="list">
                {
                this.state.classify.length> 0 && this.state.classify[this.state.i].con.map((item,index)=>{
                    return (
                        <div key={index} className="item">
                            <img src={item.icon} alt="" />
                            <span>{item.name}</span>
                        </div>    
                    )
                })
                }
                </div>
            </div>
        );
    }
}


export default Classify;